<template>
    <a-form-item 
        label="唯一标识" 
        name="name"
        required
    >
        <a-input v-model:value="curWidget.value!.options.name" placeholder="请生成">
            <template #suffix>
                <a-tooltip title="刷新">
                    <UndoOutlined @click="setId"/>
                </a-tooltip>
            </template>
        </a-input>
    </a-form-item>
</template>

<script setup lang="ts">
import { getUUID } from '@/utils';
import type { BaseWidgetType, DesignerType } from '@/xyFDesigner/type';
import { onMounted, watch, type Ref } from 'vue';

defineOptions({
    name:"name-editor"
})
const props = withDefaults(defineProps<{
    designer:DesignerType,
    curWidget:Ref<BaseWidgetType | null>
}>(),{})

const setId = ()=>{
    props.curWidget.value!.options.name = getUUID()
}
</script>

<style lang="scss" scoped>

</style>